<template>
  <div class="app-container">
    <div>
      <div class="flex justify-between align-center">
        <div>
          <p><span style="color:#fd2f2f;">当前美国时区:(-7)：{{ us_time | parseTime('y-m-d h:i:s 星期a') }}</span>
            <span style="color:#fd2f2f;">,当前欧洲时区:(+2)：{{ eur_time | parseTime('y-m-d h:i:s 星期a') }}</span>
          </p>
        </div>
      </div>
    </div>
    <el-card shadow="never">
      <!-- 条件查询 -->
      <el-form v-show="showSearch"
               ref="queryForm"
               :model="queryParams"
               label-width="120px"
               @keyup.enter.native="submitSearch"
               @submit.native.prevent>
        <el-row>

          <el-col :md="6"
                  :sm="12">
            <el-form-item label="订单:"
                          prop="name.value">
              <el-input type="textarea"
                        :rows="6"
                        v-model="queryParams.name.value"
                        placeholder="请输入订单号"
                        clearable />
            </el-form-item>
          </el-col>
          <el-col :md="6"
                  :sm="12">
            <el-form-item label="产品sku:"
                          prop="tag.value">
              <el-input v-model="queryParams.tag.value"
                        placeholder="请输入产品sku"
                        clearable />
            </el-form-item>
          </el-col>
          <el-col :md="6"
                  :sm="12">
            <el-form-item label="运营标签:"
                          prop="tag_campaign.value">
                              <el-select v-model="queryParams.tag_campaign.value" placeholder="运营标签" clearable>
                                <el-option
                                  v-for="item in tag_campaigns"
                                  :key="item.value"
                                  :label="item.label"
                                  :value="item.value">
                                  <span style="float: left">{{ item.label }}</span>
                                  <span style="float: right; color: #8492a6; font-size: 13px">{{ item.value }}</span>
                                </el-option>
                              </el-select>
            </el-form-item>
          </el-col>
          <el-col :md="6"
                  :sm="12">
            <el-form-item label="渠道:"
                          prop="tag_source.value">
                            <el-select v-model="queryParams.tag_source.value" placeholder="渠道标签" clearable>
                                <el-option
                                  v-for="item in tag_sources"
                                  :key="item.value"
                                  :label="item.label"
                                  :value="item.value">
                                  <span style="float: left">{{ item.label }}</span>
                                  <span style="float: right; color: #8492a6; font-size: 13px">{{ item.value }}</span>
                                </el-option>
                              </el-select>
            </el-form-item>
          </el-col>

          <!-- <el-col :md="6" :sm="12">
                        <el-form-item label="客户姓名:" prop="shipping_name.value">
                            <el-input v-model="queryParams.shipping_name.value" placeholder="请输入客户姓名" clearable />
                        </el-form-item>
                    </el-col> -->
          <!-- <el-col :md="6" :sm="12">
                        <el-form-item label="订单日期:" prop="created_at.value">
                            <el-date-picker
                                v-model="queryParams.created_at.value"
                                type="datetimerange"
                                range-separator="至"
                                start-placeholder="开始"
                                end-placeholder="结束"
                                align="right"
                                value-format="yyyy-MM-dd HH:mm:ss"
                            >
                            </el-date-picker>
                        </el-form-item>
                    </el-col> -->

          <el-col :md="12"
                  :sm="12"
                  style="margin-bottom: 10px;">
            <el-form-item label="美国时间段:"
                          prop="created_at.value">
              <el-date-picker v-model="queryParams.created_at.value"
                              type="daterange"
                              range-separator="至"
                              start-placeholder="开始日期"
                              end-placeholder="结束日期">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :md="6"
                  :sm="12"
                  style="margin-bottom: 10px;">
            <el-form-item label="关键字:"
                          prop="key_words.value">
              <el-input v-model="queryParams.key_words.value"
                        placeholder="请输入关键字"
                        clearable />
            </el-form-item>
          </el-col>
          <el-col :md="12"
                  :sm="12"
                  style="margin-bottom: 10px;">
            <el-form-item label="美国时间:">
              <el-radio-group @change="day_change"
                              v-model="queryParams.day_changes.value"
                              size="small"
                              class="mr5">
                <el-radio-button :label="0">今天</el-radio-button>
                <el-radio-button :label="1">昨天</el-radio-button>
                <el-radio-button :label="2">最近7天</el-radio-button>
                <el-radio-button :label="3">所有</el-radio-button>
              </el-radio-group>
            </el-form-item>
          </el-col>
          <el-col :md="6"
                  :sm="12">
            <el-form-item label="sku数量:"
                          prop="skunum.value">
              <el-input v-model="queryParams.skunum.value"
                        placeholder="请输入sku数量"
                        clearable />
            </el-form-item>
          </el-col>
          <el-col :md="6"
                  :sm="12">
            <el-form-item class="ele-text-right"
                          label-width="50px">
              <el-button type="primary"
                         size="mini"
                         @click="submitSearch"
                         icon="el-icon-search"
                         class="ele-btn-icon"
                         style="width: 100px;height: 35px">搜索 </el-button>
              <el-button @click="resetQuery"
                         size="mini"
                         icon="el-icon-refresh"
                         style="width: 100px;height: 35px">重置</el-button>

            </el-form-item>
          </el-col>
        </el-row>
      </el-form>

      <el-row :gutter="10"
              class="mb8">
        <!-- <el-col :span="1.5">
                    <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="open" v-hasPermi="api.add">添加</el-button>
                </el-col>
                <el-col :span="1.5">
                    <el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete" v-hasPermi="api.delete">删除</el-button>
                </el-col> -->
        <!-- <el-col :span="1.5"
                style="float: right;">
          <el-button v-if="editable"
                     type="warning"
                     icon="el-icon-plus"
                     size="small"
                     v-loading="exportLoading"
                     @click="editRowComplete"
                     v-hasPermi="api.export">开始批量修改</el-button>
          <el-button v-else
                     type="success"
                     icon="el-icon-plus"
                     size="small"
                     v-loading="exportLoading"
                     @click="editRow"
                     v-hasPermi="api.export">完成修改</el-button>
        </el-col> -->
        <!-- <el-col :span="1.5">
          <el-button type="primary"
                     icon="el-icon-download"
                     size="small"
                     v-loading="exportLoading_achievement"
                     @click="handleExport_achievement"
                     v-hasPermi="api.export_achievement">导出销售业绩</el-button>
        </el-col> -->
        <el-col :span="1.5">
          <el-button type="primary"
                     size="small"
                     @click="skuOpening">按sku查看销售业绩</el-button>
        </el-col>
        <el-col :span="1.5">
          <el-button type="primary"
                     size="small"
                     @click="salesPerformanceOpening">按渠道查看销售业绩</el-button>
        </el-col>
        <el-col :span="1.5">
          <el-button type="warning"
                     plain
                     size="small"
                     @click="table_log = true">每日确认</el-button>
        </el-col>
        <el-col :span="1.5"
                style="float: right;">
          <el-button type="warning"
                     icon="el-icon-plus"
                     size="small"
                     @click="multipleEditOpening"
                     :disabled="!multiple_customerjourney.length">开始批量修改</el-button>
        </el-col>

        <el-col :span="1.5"
                style="float: right;">
          <el-button
                     type="success"
                     icon="el-icon-plus"
                     size="small"
                     v-loading="exportLoading"
                     :disabled="!multiple_customerjourney.length"
                     @click="editRow"
                     v-hasPermi="api.export">提交批量修改</el-button>
        </el-col>
        
        <right-toolbar :showSearch.sync="showSearch"
                       @queryTable="initIndex"
                       :columns="columns"
                       printId="#quickadmin"></right-toolbar>
      </el-row>

      <el-drawer title="每日确认"
                 :visible.sync="table_log"
                 direction="rtl"
                 size="50%">
        <el-col :span="1.5">
          <el-button type="info"
                     plain
                     size="small"
                     @click="batch_confirmation">批量确认</el-button>
        </el-col>
        <el-table :data="table_customerjourney"
                  @selection-change="handleSelectionChange"
                  v-loading="loading_log">
          <el-table-column type="selection"
                           width="55">
          </el-table-column>
          <el-table-column property="time"
                           label="日期（美国日期）"
                           width=""></el-table-column>
        </el-table>
      </el-drawer>

      <el-tabs v-model="activeTab"
               @tab-click="handleStatus"
               type="border-card"
               class="elTabs">
        <el-tab-pane v-for="(item, index) in status"
                     :key="index"
                     :label="item.label"
                     :name="item.value.toString()">
          <template>

          </template>

        </el-tab-pane>
      </el-tabs>
      <el-table :data="tableData"
                border
                v-loading="loading"
                style="width: 100%"
                @cell-click="cellDblclick"
                @selection-change="handleSelectionChange"
                ref="selTable">
        <el-table-column type="selection"
                         width="55">
        </el-table-column>
        <el-table-column prop="name"
                         label="订单"
                         width="130px">
          <template slot-scope="scope">
            <p>订单号:<span style="font-weight: bold;">{{ scope.row.name }}</span></p>
            <p>现销售额:<span style="font-weight: bold;">{{ scope.row.total_price }}</span></p>
            <p>订单状态:<span style="font-weight: bold;">{{ scope.row.financial_status }}</span></p>
            <p>时间:<span style="font-weight: bold;">{{ scope.row.created_at }}</span></p>
          </template>
        </el-table-column>
        <!-- <el-table-column prop="created_at"
            label="时间"
            sortable>
        </el-table-column> -->
        <!-- <el-table-column
                            prop="shipping_name"
                            label="客户">
                        </el-table-column>
                        <el-table-column
                            prop="total_price"
                            label="金额$">
                        </el-table-column>
                        <el-table-column
                            prop="financial_status"
                            label="支付状态">
                        </el-table-column>
                        <el-table-column
                            prop="fulfillment_status"
                            label="物流状态">
                        </el-table-column> -->
        <el-table-column label="是否匹配"
                         width="130px">
          <template slot-scope="scope">
            <div>
              <p><span style="font-weight: bold;color: #4B26A7;">{{ scope.row.status_type }}</span></p>
            </div>
          </template>
        </el-table-column>

        <el-table-column label="商品信息"
                         width="130px">
          <template slot-scope="scope">
            <div v-for="(item, index) in scope.row.skus_info"
                 :key="index">
              <p v-if="item.brand">sku:<span style="font-weight: bold;">{{ item.brand }}</span></p>
              <p v-if="item.tags">标签:<span style="font-weight: bold;">{{ item.tags }}</span></p>
            </div>
          </template>
        </el-table-column>
        <el-table-column label="shopifyAPI来源"
                         width="260px">
          <template slot-scope="scope">
            <p>firstVisit_source:<span style="font-weight: bold;">{{ scope.row.firstVisit_source }}</span></p>
            <p>firstVisit_campaign:<span style="font-weight: bold;">{{ scope.row.firstVisit_campaign }}</span></p>
            <p>lastVisit_source:<span style="font-weight: bold;">{{ scope.row.lastVisit_source }}</span></p>
            <p>lastVisit_campaign:<span style="font-weight: bold;">{{ scope.row.lastVisit_campaign }}</span></p>
            <p>landingSite:<span style="font-weight: bold;"
                    v-html="scope.row.landing_site"></span></p>
          </template>
        </el-table-column>
        <el-table-column label="辅助插件来源"
                         width="260px">
          <template slot-scope="scope">
            <p v-if="scope.row.last_campaign">last_campaign:<span style="font-weight: bold;">{{ scope.row.last_campaign }}</span></p>
            <p v-if="scope.row.last_source">last_source:<span style="font-weight: bold;">{{ scope.row.last_source }}</span></p>
            <p v-if="scope.row.first_campaign">first_campaign:<span style="font-weight: bold;">{{ scope.row.first_campaign }}</span></p>
            <p v-if="scope.row.first_source">first_source:<span style="font-weight: bold;">{{ scope.row.first_source }}</span></p>
          </template>
        </el-table-column>
        <el-table-column label="运营标签"
                         width="">
          <template slot-scope="scope">
            <div v-if="!scope.row.yyEditing">
              <p><span style="font-weight: bold;color: #4B26A7;">{{ scope.row.tag_campaign }}</span></p>
            </div>
            <el-select v-model="scope.row.tag_campaign"
                       filterable
                       allow-create
                       @visible-change="selChange($event, scope.row, 'yyEditing')"
                       v-else>
              <el-option v-for="item in yyArr"
                         :key="item.value"
                         :label="item.label"
                         :value="item.value">
              </el-option>
            </el-select>
          </template>
        </el-table-column>
        <el-table-column label="渠道"
                         width="">
          <template slot-scope="scope">
            <template v-if="!scope.row.qdEditing">
              <div>
                <p><span style="font-weight: bold;color: #4B26A7;">{{ scope.row.tag_source }}</span></p>
              </div>
            </template>
            <el-select v-model="scope.row.tag_source"
                       filterable
                       allow-create
                       @visible-change="selChange($event, scope.row, 'qdEditing')"
                       v-else>
              <el-option v-for="item in qdArr"
                         :key="item.value"
                         :label="item.label"
                         :value="item.value">
              </el-option>
            </el-select>
          </template>
        </el-table-column>

        <el-table-column label="原标签参考"
                         width="130px">
          <template slot-scope="scope">
            <div>
              <p><span style="font-weight: bold;color: #4B26A7;">{{ scope.row.tags }}</span></p>
            </div>
          </template>
        </el-table-column>

      </el-table>
      <!-- 列表 -->

      <!-- 分页 -->
      <pagination :total="total"
                  :page.sync="pageInfo.page"
                  :limit.sync="pageInfo.limit"
                  :pageSizes="[10, 20, 30, 40, 50, 100, 200, 500]"
                  @pagination="initIndex" />
    </el-card>

    <!-- 编辑弹窗 -->
    <el-dialog :title="!disabled ? '编辑' : '详情'"
               :visible="editOpen"
               :before-close="beforeClose"
               destroy-on-close>
      <EditForm ref="editForm"
                :findFormData="findFormData"
                :disabled="disabled"
                @submitForm="submitForm"
                :editFormParams="editFormParams"
                @editFormCancel="beforeClose" />
    </el-dialog>

    <!-- 按sku查看销售业绩弹窗 -->
    <el-dialog title="按sku查看销售业绩"
               :visible.sync="skuOpen"
               destroy-on-close>
      <skuCom ref="sku"
              :queryParams="queryParams" />
    </el-dialog>
    <!-- 按渠道查看销售业绩弹窗 -->
    <el-dialog title="按渠道查看销售业绩"
               :visible.sync="salesPerformanceOpen"
               destroy-on-close>
      <SalesPerformance ref="salesPerformance"
                        :exportLoading_achievement="exportLoading_achievement"
                        :exportLoading_achievementOrder="exportLoading_achievementOrder"
                        :queryParams="queryParams"
                        @handleExportAchievementOrder="handleExportAchievementOrder"
                        @handleExportAchievement="handleExportAchievement" />
    </el-dialog>

    <!-- 批量修改弹窗 -->
    <el-dialog title="批量修改"
               :visible.sync="multipleEditOpen"
               destroy-on-close
               class="editDialog"
               width="60%">
      <el-row type="flex"
              align="center"
              justify="space-around"
              v-for="v in multipleArr"
              :key="v.id">
        <el-col :span="3"
                class="order-number">订单号：{{ v.order_number }}</el-col>
        <el-col :span="10"
                class="labelBlock">
          <span class="edit-label">运营标签(原值<span style="font-weight: bold;color: #4b26a7;">{{ v.tag_campaign }}</span>)：</span>
          <el-select v-model="multipleTag_campaign"
                     filterable
                     allow-create>
            <el-option v-for="item in yyArr"
                       :key="item.value"
                       :label="item.label"
                       :value="item.value">
            </el-option>
          </el-select>
        </el-col>
        <el-col :span="9"
                class="labelBlock">
          <span class="edit-label">渠道(原值<span style="font-weight: bold;color: #4b26a7;">{{ v.tag_source }}</span>)：</span>
          <el-select v-model="multipleTag_source"
                     filterable
                     allow-create>
            <el-option v-for="item in qdArr"
                       :key="item.value"
                       :label="item.label"
                       :value="item.value">
            </el-option>
          </el-select>
        </el-col>
      </el-row>
      <span slot="footer"
            class="dialog-footer">
        <el-button @click="multipleEditOpen = false">取 消</el-button>
        <el-button type="primary"
                   @click="multipleEditConfirm">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import { curdMixin } from '@/mixins/curdMixin'
import EditForm from './EditFormCom'
import SkuCom from './SkuCom'
import SalesPerformance from './SalesPerformance'
export default {
  name: 'Curd',
  mixins: [curdMixin],
  components: { EditForm, SalesPerformance, SkuCom },
  data () {
    return {
      skuOpen: false,
      salesPerformanceOpen: false,
      loading_log: false,
      table_log: false,
      multipleEditOpen: false,
      table_customerjourney: [],
      multiple_customerjourney: [],
      multipleArr: [],
      multipleTag_campaign: '',
      multipleTag_source: '',
      us_time: 0,
      eur_time: 0,
      // table结构
      columns: [
        {
          visible: true,
          label: '订单',
          prop: 'name',
        },
        {
          visible: true,
          label: '时间',
          prop: 'created_at',
        },
        {
          visible: true,
          label: '客户',
          prop: 'shipping_name',
        },
        {
          visible: true,
          label: '金额',
          prop: 'total_price',
        },
        {
          visible: true,
          label: '支付状态',
          prop: 'financial_status',
        },
        {
          visible: true,
          label: '物流状态',
          prop: 'fulfillment_status',
        },
      ],
      // 接口地址
      api: {
        index: `/admin/customerjourneywoob/index`,
        find: `/admin/customerjourneywoob/find`,
        add: `/admin/customerjourneywoob/add`,
        edit: `/admin/customerjourneywoob/edit`,
        delete: `/admin/customerjourneywoob/delete`,
        export: `/admin/customerjourneywoob/export`,
        batch_modification: `/admin/customerjourneywoob/batch_modification`,
        export_achievement: `/admin/customerjourneywoob/export_achievement`,
        export_achievement_order: `/admin/customerjourneywoob/export_achievement_order`,
        batch_confirmation: `/admin/customerjourneywoob/batch_confirmation`,
        upload: `https://api.fan-zhou.com/admin/customerjourneywoob/uploads`,
        status: `/admin/customerjourneywoob/status`
      },
      editFormParams: {
      },
      pageInfo: {
        sort: 'id',
      },
      primaryKey: 'id',
      // 搜索表单是否展开
      searchExpand: false,
      //是否展示搜索
      showSearch: true,
      // 查询参数
      queryParams: {
        title: { value: undefined, op: '%like%' },
        name: { value: undefined, op: '%like%' },
        shipping_name: { value: undefined, op: '%like%' },
        number: { value: undefined, op: '%like%' },
        sku: { value: undefined, op: '=' },
        financial_status: { value: undefined, op: '=' },
        fulfillment_status: { value: undefined, op: '=' },
        created_at: { value: [], op: 'range' },
        status: { value: [], op: '=' },
        day_changes: { value: 1, op: '=' },
        tag_campaign: { value: undefined, op: '%like%' },
        tag_source: { value: undefined, op: '%like%' },
        key_words: { value: undefined, op: '%like%' },
        tag: { value: undefined, op: '%like%' },
        skunum: { value: undefined, op: '%like%' },
      },
      day_changes: 1,
      status: [
        { label: '全部', value: '' },
        { label: '未匹配', value: 'unmatched' },
        { label: '匹配成功', value: 'matched' },
        { label: '匹配失败', value: 'matching_failed' },
        { label: '手动修改标签', value: 'manually_modifying' },
        { label: 'fb', value: 'fb' },
        { label: 'tt', value: 'tt' },
        { label: 'ggad', value: 'ggad' },
        { label: '直接访问', value: 'direct_access' },
        { label: 'email', value: 'email' },
        { label: 'other', value: 'other' },
        { label: '联盟网红', value: 'AllianceInternetCelebrity' },
      ],

      tag_campaigns: [
        {
          value: 'lxf',
          label: '李晓飞'
        }, {
          value: 'ZX',
          label: '张兴'
        }, {
          value: 'RJW',
          label: '任洁文'
        }, {
          value: 'TXL',
          label: '陶小兰'
        }, {
          value: 'MF',
          label: '马芳'
        }, {
          value: 'khb',
          label: '柯海波'
        }, {
          value: 'HJ',
          label: '胡锦'
        }, {
          value: 'hsw',
          label: '侯思维'
        }, {
          value: 'bwh',
          label: '白文华'
        }, {
          value: 'zby',
          label: '章博语'
        }, {
          value: 'wwj',
          label: '伍文娟'
        }, {
          value: 'xlh',
          label: '许良海'
        }, {
          value: 'zb',
          label: '曾贝'
        }, {
          value: 'gjw',
          label: '郭佳伟'
        }, {
          value: 'null',
          label: '运营标签为空'
        }
      ],
      tag_sources: [
        {
          value: 'fb',
          label: 'Facebook'
        }, {
          value: 'tt',
          label: 'TikTok'
        }, {
          value: 'ggad',
          label: 'google'
        }, {
          value: 'null',
          label: '渠道标签为空'
        }
      ],

      activeTab: '',
      start_time: new Date(),
      end_time: new Date(),
      editable: true,
      exportLoading: false,
      yyArr: [],
      qdArr: []
    }
  },
  created () {
    this.initIndex()
    this.now();
  },
  methods: {
    skuOpening () {
      this.skuOpen = true
      this.$nextTick(() => {
        this.$refs.sku.getData()
      })
    },
    salesPerformanceOpening () {
      this.salesPerformanceOpen = true
      this.$nextTick(() => {
        this.$refs.salesPerformance.getData()
      })
    },
    multipleEditOpening () {
      this.multipleEditOpen = true
      this.multipleArr = []
      this.multipleTag_campaign = ''
      this.multipleTag_source = ''
      this.multiple_customerjourney.forEach(v => {
        this.multipleArr.push(
          {
            id: v.id,
            order_number: v.order_number,
            tag_campaign: v.tag_campaign,
            tag_source: v.tag_source
          }
        )
      })
    },
    multipleEditConfirm () {
      this.multipleEditOpen = false
      const { multipleTag_campaign, multipleTag_source, multipleArr } = this
      let paramsArray = []
      if (multipleTag_campaign || multipleTag_source) {
        multipleArr.forEach(v => {
          const { id, order_number, tag_campaign, tag_source } = v
          paramsArray.push({
            id,
            order_number,
            tag_campaign: multipleTag_campaign || tag_campaign,
            tag_source: multipleTag_source || tag_source
          })
        })
      } else {
        paramsArray = [...multipleArr]
      }
      this.$refs.selTable.clearSelection()
      this.editYyOrQd(paramsArray, true)
    },
    handleExportAchievement () {
      this.handleExport_achievement({})
    },
    handleExportAchievementOrder () {
      this.handleExport_achievementOrder({})
    },
    cellDblclick (row, column, cell, event) {
      if (column.label == '运营标签') {
        row.yyEditing = true
      } else if (column.label == '渠道') {
        row.qdEditing = true
      }
    },
    selChange (evt, row, editing) {
      // if (!evt) {
      //   row[editing] = false
      //   const { id, order_number, tag_campaign, tag_source } = row
      //   const paramsArray = [{ id, order_number, tag_campaign, tag_source }]
      //   this.loading = true
      //   this.editYyOrQd(paramsArray)
      // }
    },
    async editYyOrQd (paramsArray, reload = false) {
        const response = await this.request.post(this.api.batch_modification, { paramsArray })
        this.msgSuccess(response.msg)
        this.initIndex()
        // reload && this.initIndex()
      
    },
    // 弃用 ↓
    editRow () {
      this.editable = true;

      this.$confirm(`是否确认批量修改?`, '警告', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      })
        .then(() => {
          this.exportLoading = true
          this.handletf_apply();
        })
        .catch(() => { })
        .finally(() => {
        })
    },
    editRowComplete () {
      this.editable = false;
    },
    async handletf_apply () {
      const paramsArray = [];
      for (let v = 0; v < this.tableData.length; v++) {
        paramsArray.push({ id: this.tableData[v].id, tag_campaign: this.tableData[v].tag_campaign, tag_source: this.tableData[v].tag_source, order_number: this.tableData[v].order_number });
      }
      let response = await this.request.post(this.api.batch_modification, {
        paramsArray,
      })
      this.msgSuccess(response.msg)
      this.initIndex()
      this.exportLoading = false
    },
    // 弃用 ↑
    // 北京时间
    now () {
      this.us_time = new Date().getTime() - 15 * 3600 * 1000;
      setInterval(() => {
        this.us_time = new Date().getTime() - 15 * 3600 * 1000;
      }, 1000)
      this.eur_time = new Date().getTime() - 6 * 3600 * 1000;
      setInterval(() => {
        this.eur_time = new Date().getTime() - 6 * 3600 * 1000;
      }, 1000)
    },
    day_change (val) {
      this.loading = true
      this.queryParams.day_changes.value = val
      this.queryParams.created_at.value = ""
      this.submitSearch();
    },
    // 案列：当前组件格式化方法
    testFormatter (prop) {
      return prop
    },
    handleStatus (tab) {
      this.loading = true
      this.queryParams.status.value = tab.name
      this.submitSearch()
    },

    submitUpload () {
      this.loading = true
      this.$refs.upload.submit();
    },
    handleRemove (file, fileList) {
      console.log(file, fileList);
    },
    handlePreview (file) {
      console.log(file);
    },

    // 上传成功回调
    handleUploadSuccess (res) {
      this.loading = false
      if (res.code == 1) {
        this.$notify({
          title: '成功',
          message: res.data,
          type: 'success'
        });
        this.initIndex();
      } else {
        this.$message({
          type: 'error',
          message: '上传失败' + res.msg,
        })
      }
    },
    // 上传失败
    handleUploadError () {
      this.$message({
        type: 'error',
        message: '上传失败',
      })
    },
    handleSelectionChange (val) {
      this.multiple_customerjourney = val;
    },
    // 批量完成
    batch_confirmation (row) {
      this.$confirm('是否确认操作所有数据项?', '警告', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      })
        .then(() => {
          return this.request.post(this.api.batch_confirmation, {
            multiple_customerjourney: this.multiple_customerjourney
          })
        })
        .then(response => {
          this.msgSuccess(response.msg)
          this.initIndex()
        })
        .catch(err => { })
        .finally(() => {
        })
    },

  }
}
</script>
<style lang="scss">
.btn-mar {
    margin: 5px !important;
}
.el-popover {
    max-width: 30%;
}
.elTabs {
    border-bottom: none;
    .el-tabs__content {
        padding: 5px;
    }
}
.editDialog .el-dialog {
    min-width: 1000px;
    .el-row + .el-row {
        margin-top: 20px;
    }
    .order-number {
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .labelBlock {
        display: flex;
        align-items: center;
        .edit-label {
            width: 150px;
        }
    }
}
// .el-table .current-row span, .el-table .el-button2, .el-table .el-input {
//     display: block !important;
// }
</style>
